<div>
<form class="form-horizontal" role="form" name="modelForm" novalidate>
  <div class="form-ctrl md-whiteframe-z1">
    <div class="form-search" style="height:160px;" ng-class="{true: 'shou'}[!toggle]">
      <div>
        <label style="">业务系统</label>
        <md-select ng-model="failureModel.systemCode" aria-label="系统选项">
          <md-select-label>{{failureModel.systemCode ? failureModel.systemCode.systemName : "统一支付"}}</md-select-label>
          <md-option ng-value="system"  ng-repeat="system in selector.systemCode">{{system.systemName}}</md-option>
        </md-select>
      </div>
      <div>
        <label style="">业务列表</label>
        <md-select ng-model="failureModel.businessCode" md-on-open="getBusinesses(failureModel.systemCode)" aria-label="业务选项">
          <md-select-label>{{failureModel.businessCode ? failureModel.businessCode.businessName : "全部"}}</md-select-label>
          <md-option ng-value="" >{{"全部"}}</md-option>
          <md-option ng-value="business"  ng-repeat="business in selector.businessCode">{{business.businessName}}</md-option>
        </md-select>
      </div>
      <div>
        <label style="">省份</label>
        <md-select  ng-model="failureModel.provinceCode" aria-label="省份选项">
          <md-select-label>{{failureModel.provinceCode ? failureModel.provinceCode.provinceName : "全部"}}</md-select-label>
          <md-option ng-value="" >{{"全部"}}</md-option>
          <md-option ng-value="province"  ng-repeat="province in selector.provinceCode">{{province.provinceName}}</md-option>
        </md-select>
      </div>
      <div>
        <label style="">时间粒度</label>
        <md-select  ng-model="failureModel.timeType" aria-label="时间粒度">
          <md-select-label>{{failureModel.timeType ? failureModel.timeType.timeTypeName : "天"}}</md-select-label>
          <md-option ng-value="timeType"  ng-repeat="timeType in selector.timeTypes">{{timeType.timeTypeName}}</md-option>
        </md-select>
      </div>
      <div>
        <md-button aria-label="重置" style="height: 40px;position: relative;top: 5px;width:100px;" class="md-raised ico-btn" ng-click="resetParam()">重置</md-button>
        <md-button class="md-raised" style="background-color: #FF9800;color:white;height: 40px;position: relative;top: 5px;width:100px;" ng-click="modelAddition($event)" aria-label="新增">新增</md-button>
      </div>
    </div>
    <i class="glyphicon glyphicon-chevron-up shrinkage" ng-click="toggle=false" ng-show="isQuery"></i>
    <md-button ng-click="getFailureModel()" class="md-fab md-primary md-hue-1" aria-label="Profile" >
      <i class="glyphicon glyphicon-search"  ng-show="toggle"></i>
      <i class="glyphicon glyphicon-arrow-down" style="margin-top:28px;" ng-show="!toggle"></i>
    </md-button>
  </div>
</form>

<div class="table-info" ng-controller="failureModelViewCtrl">
  <div>
     <div class="menus"> 
      <md-button class="md-raised" style="background-color: #FF9800;color:white"ng-hide="show.table || show.chart" ng-click="modelUpdate($event)" aria-label="修改">修改</md-button>
      <md-button class="md-raised" style="background-color: #FF9800;color:white"ng-hide="show.table || show.chart" ng-click="deleteBuild($event)" aria-label="删除">删除</md-button>
      <md-button aria-label="列表" class="md-raised ico-btn" ng-show="show.table || show.chart" ng-click="changeShowType('table')">
        <img src="images/tables.png">
      </md-button>
      <md-button aria-label="图表" class="md-raised ico-btn" ng-show="show.table || show.chart" ng-click="changeShowType('chart')">
        <img src="images/charts.png">
      </md-button> 
      <md-button aria-label="返回" class="md-raised ico-btn"ng-show="show.table || show.chart" ng-click="show.table = false;show.chart = false">返回
      </md-button>
    </div>
    <div class="table-detail" ng-hide="show.table || show.chart">
      <div class="t_r" style="padding: 20px 0px;height:378px;">
        <div class="t_r_t" id="t_r_t">
          <div class="t_r_title">
            <table class="table table-bordered">
              <caption style="text-align:center;font-size:large;font-weight:bold;color:black">{{title}}</caption>
              <tr>
                 <th width="10%">
                   <md-checkbox style="margin:0px;" ng-model="allCheck" aria-label="allCheck" ng-click="pickAll()"></md-checkbox>
                 </th>
                 <th width="18%">省公司</th>
                 <th width="18%">系统</th>
                 <th width="18%">业务</th>
                 <th width="18%">时间粒度</th>
                 <th width="18%">操作</th>
              </tr>
            </table>
          </div>
        </div>
        <div class="t_r_content" id="t_r_content">
          <table class="table table-bordered">
            <tr ng-repeat="item in models">
              <td width="10%">
                <md-checkbox style="margin:0px;" ng-model="item.checked" aria-label="modelCheck" ng-click="pickModel(item)"></md-checkbox>
              </td>
              <td width="18%">{{item.provinceName}}</td>
              <td width="18%">{{item.systemName}}</td>
              <td width="18%">{{item.businessName}}</td>
              <td width="18%">{{'天'}}</td>
              <td width="18%" style="cursor:pointer" ng-click="singletonModel(item)">
                查看
              </td>
            </tr>
          </table>
        </div>
        <div ng-if="isQuery">
        <ds-page
                total-count=totalCount
                page-size=page.pageSize
                page-itmes=pageItmes
                param=param
                current-page=page.currentPage
                go-page="turnToPage(param)"
                page-size-change="pageSizeChange(size)"
                show-max-page="5"
                first-text="<<"
                last-text=">>"
                previous-text="<"
                next-text=">"
                >
        </ds-page>
    </div>
      </div>
    </div>
    <div class="table-detail" ng-show="show.table">
      <div class="t_r" style="padding: 20px 0px;height:378px;">
        <div class="t_r_t" id="t_r_t">
          <div class="t_r_title">
            <table class="table table-bordered">
              <caption style="text-align:center;font-size:large;font-weight:bold;color:black">{{title}}</caption>
              <tr>
                 <th width="18%">时间</th>
                 <th width="18%">最大值</th>
                 <th width="18%">最小值</th>
                 <th width="18%">平均值</th>
              </tr>
            </table>
          </div>
        </div>
        <div class="t_r_content" id="t_r_content">
          <table class="table table-bordered">
            <tr ng-repeat="item in series">
              <td width="18%">{{item.time}}</td>
              <td width="18%">{{item.warningMax}}</td>
              <td width="18%">{{item.warningMin}}</td>
              <td width="18%">{{item.avg}}</td>
            </tr>
          </table>
        </div>
      </div>
    </div>
    <div id="failureModelChart" style="height:398px;width:100%" ng-show="show.chart"></div>
  </div>
</div>
</div>